<template>
  <div>
    <a-form :form="form" class="form" @submit="handleSubmit">
      <a-card
        class="card"
        title="输入病床信息"
        :bordered="false"
        type="flex"
        justify="space-around"
        align="middle">
        <a-row class="form-row" :gutter="16">
          <a-col :lg="10" :md="12" :sm="24">
            <a-form-item label="病房号">
              <a-input
                placeholder="请输入病房号"
                v-model="data.number"
                v-decorator="[
                  'number',
                  {initialValue: data.number,rules: [{ required: true, message: '请输入病房号', whitespace: true}]}
                ]"
                readOnly/>
            </a-form-item>
          </a-col>
          <a-col :xl="{span: 10, offset: 1}" :lg="6" :md="12" :sm="24">
            <a-form-item label="床位数">
              <a-input
                placeholder="请输入床位数"
                v-model="data.count"
                v-decorator="[
                  'count',
                  {initialValue: data.count,rules: [{ required: true, message: '请输入床位数', whitespace: true}]}
                ]" />
            </a-form-item>
          </a-col>
          <!--          <a-col :lg="10" :md="12" :sm="24">-->
          <!--            <a-form-item-->
          <!--              label="部门">-->
          <!--              <a-select-->
          <!--                placeholder="部门"-->
          <!--                v-model="data.department"-->
          <!--                v-decorator="[ 'department', {rules: [{ required: true, message: '请选择部门'}]} ] ">-->
          <!--                <a-select-option v-for="d in ds" :key="d.key">{{ d.text }}</a-select-option>-->
          <!--              </a-select>-->
          <!--            </a-form-item>-->
          <!--          </a-col>-->
          <!--          <a-col :lg="10" :md="12" :sm="24">-->
          <!--            <a-form-item label="护士">-->
          <!--              <a-input-->
          <!--                placeholder="请输入护士"-->
          <!--                v-model="data.nurse"-->
          <!--                v-decorator="[-->
          <!--                  'nurse',-->
          <!--                  {rules: [{ required: true, message: '请输入护士', whitespace: true}]}-->
          <!--                ]" />-->
          <!--            </a-form-item>-->
          <!--          </a-col>-->
        </a-row>
        <a-form-item
          :wrapperCol="{ span: 24 }"
          style="text-align: center"
        >
          <a-button htmlType="submit" type="primary">确定</a-button>
          <a-button style="margin-left: 8px" @click="goBack()">返回</a-button>
        </a-form-item>
      </a-card>
    </a-form>
  </div>
</template>

<script>
import { getWard, updateWard } from '../../api/ward'
import { departmentList } from '../../dictionary'
export default {
  name: 'EditWard',
  data () {
    return {
      ward: '',
      nurse: '',
      nurseList: [],
      data: {},
      ds: departmentList,
      form: this.$form.createForm(this)
    }
  },
  methods: {
    handleSubmit (e) {
      e.preventDefault()
      this.form.validateFields((err, values) => {
        if (!err) {
          updateWard(this.data).then(res => {
            this.$router.push('/ward/index')
            this.$notification.success({
              message: '成功',
              description: `修改成功`
            })
          }).catch(res => {
            console.log('err', err)
            this.$notification.error({
              message: '失败',
              description: `修改失败`
            })
          })
        }
      })
    },
    goBack () {
      this.$router.push('/ward/index')
    }
  },
  mounted () {
    this.ward = this.$route.query.ward // 获取路径参数 id
    if (this.ward === undefined || this.ward === null) {
      this.$router.push('/ward/index')
    }
    console.log('ward:', this.ward)
    getWard(this.ward).then(res => { // 调用 getNurseById api 获取该 id 下的用户数据
      console.log('res', res)
      this.data = res.result
      this.form.setFieldsValue({
        'number': this.data.number,
        'count': this.data.count
      })
    }).catch(err => {
      console.log('err', err)
    })
  }
}
</script>

<style scoped>

</style>
